<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>	AJAX get请求</title>
		<style type="text/css">
			/* #result{
				width: 400px;
				height: 200px;
				border: solid 4px #DC143C;
			} */
		</style>
	</head>
	<body>
		<button type="button" onclick="aa();">获取当前时间</button>
		<button type="button" onclick="ab();">随机一句名言</button>
		<button type="button" onclick="ac();">获取诗词列表</button>
		<button type="button" onclick="ad();">获取诗词作者列表</button>
		<button type="button" onclick="ae();">平台接口预览</button>
		<div id="result"></div>
	</body>
	<script type="text/javascript">
		var div = document.getElementById('result');
		function aa(){
			//创建对象
			var xhr = new XMLHttpRequest();
			//初始化 设置请求方法和 url
			xhr.open('GET','http://poetry.apiopen.top/getTime');
			//发送
			xhr.send();
			//事件绑定 处理服务端的返回结果
			//on when 当、、的时候
			//readystate 是 xhr 对象中的属性 表示状态 
			//0(未初始化) 1(open方法调用完毕) 2(send方法调用完毕) 3(服务端返回的部分结果) 4(服务端返回的所有结果)
			//change 改变
			
			xhr.onreadystatechange = function(){
				//服务端返回的所有结果
				if (xhr.readyState == 4) {
					//判断响应状态码 200 404 500 401 403
					//2xx 成功
					 if (xhr.status >=200 && xhr.status<300) {
					 	//处理结果 行 头 空行 体
						console.log(xhr.status);//状态码
						console.log(xhr.statusText);//状态字符串
						// console.log(xhr.getAllResponseHeaders());//所有的响应头
						console.log(xhr.response);//响应体
						console.log(xhr.responseText);
						var obj = JSON.parse(xhr.responseText);
						console.log(obj.result)
						var px = '日期：'+obj.result.date;
						px += '<br>'+'时间：'+obj.result.time;
						px += '<br>'+'星期：'+obj.result.weekday;
						px += '<br>'+'日期时间：'+obj.result.dateTime;
						div.innerHTML =px;
					 }
				}
			}
		}
		function ab(){
			var xhr = new XMLHttpRequest();
			xhr.open('GET','http://poetry.apiopen.top/sentences');
			xhr.send();
			xhr.onreadystatechange = function(){
				if (xhr.readyState == 4) {
					 if (xhr.status >=200 && xhr.status<300) {
						console.log(xhr.status);//状态码
						console.log(xhr.statusText);//状态字符串
						console.log(xhr.getAllResponseHeaders());//所有的响应头
						// console.log(xhr.response);//响应体
						console.log(xhr.responseText);
						var obj = JSON.parse(xhr.responseText);
						console.log(obj.result)
						var px= '诗句：'+obj.result.name;
						px += '<br>'+'作者：'+obj.result.from;
						div.innerHTML = px;
					 }
				}
			}
		}
		function ac(){
			var xhr = new XMLHttpRequest();
			xhr.open('GET','http://poetry.apiopen.top/poetryFull?count=2&page=1');
			xhr.send();
			xhr.onreadystatechange = function(){
				if (xhr.readyState==4) {
					if (xhr.status>=200 && xhr.status<300) {
						console.log(xhr.status);
						console.log(xhr.statusText);
						var obj = JSON.parse(xhr.responseText);
						console.log(obj.result[0]);
						var px = '<h3>诗名：</h3>'+obj.result[0].title;
						px += '<br />'+'<h3>朝代：</h3>'+ obj.result[0].dynasty;
						px += '<br />'+'<h3>作者：</h3>'+ obj.result[0].writer;
						px += '<br />'+'<h3>诗句：</h3>'+ obj.result[0].content;
						px += '<br />'+'<h3>类型：</h3>'+ obj.result[0].type;
						px += '<br />'+'<h3>评论：</h3>'+ obj.result[0].remark;
						px += '<br />'+'<h3>欣赏：</h3>'+ obj.result[0].appreciation;
						px += '<br />'+'<h3>译文：</h3>'+ obj.result[0].translation;
						px += '<br />'+'<h3>简单介绍：</h3>'+ obj.result[0].simpleIntro;
						px += '<br />'+'<h3>详细介绍：</h3>'+ obj.result[0].detailIntro;
						
						console.log(obj.result[1]);
						var px1 = '<h3>诗名：</h3>'+obj.result[1].title;
						px1 += '<br />'+'<h3>朝代：</h3>'+ obj.result[1].dynasty;
						px1 += '<br />'+'<h3>作者：</h3>'+ obj.result[1].writer;
						px1 += '<br />'+'<h3>诗句：</h3>'+ obj.result[1].content;
						px1 += '<br />'+'<h3>类型：</h3>'+ obj.result[1].type;
						px1 += '<br />'+'<h3>评论：</h3>'+ obj.result[1].remark;
						px1 += '<br />'+'<h3>欣赏：</h3>'+ obj.result[1].appreciation;
						px1 += '<br />'+'<h3>译文：</h3>'+ obj.result[1].translation;
						px1 += '<br />'+'<h3>简单介绍：</h3>'+ obj.result[1].simpleIntro;
						px1 += '<br />'+'<h3>详细介绍：</h3>'+ obj.result[1].detailIntro;
						div.innerHTML = px + px1;
					}
				}
			}
		}
		function ad(){
			var xhr = new XMLHttpRequest();
			xhr.open('GET','http://poetry.apiopen.top/poetryAuthor?count=2&page=1&name=李白');
			xhr.send();
			xhr.onreadystatechange = function(){
				if (xhr.readyState==4) {
					if (xhr.status>=200 && xhr.status<300) {
						var obj = JSON.parse(xhr.responseText);
						console.log(obj.result);
						var px = '<h3>作者：</h3>'+ obj.result.name;
						px += '<br />'+'<h3>简单介绍：</h3>'+ obj.result.simpleIntro;
						px += '<br />'+'<h3>详细介绍：</h3>'+ obj.result.detailIntro;
						div.innerHTML = px;
					}
				}
			}
		}
		function ae(){
			var xhr = new XMLHttpRequest();
			xhr.open('GET','https://api.apiopen.top/getAllUrl');
			xhr.send();
			xhr.onreadystatechange = function(){
				if (xhr.readyState ==4) {
					if (xhr.status>=200 && xhr.status<300) {
						// var obj = JSON.parse(xhr.responseText);
						// console.log(obj.result);
						div.innerHTML =xhr.responseText;
					}
				}
			}
		}
	</script>
</html>
